<template>
  <div class="task_detail_page">
    <!-- <div style="margin-bottom: 26px;">
      <a-button @click="goBack()">返回</a-button>
    </div>
    <a-divider style="margin-bottom: 32px"/> -->
    <detail-list>
        <detail-list-item term="用户昵称">{{userItem.nickname}}</detail-list-item>
        <detail-list-item term="用户账号">{{userItem.phone}}</detail-list-item>
        <detail-list-item term="余额">{{userItem.balance}}</detail-list-item>
        <detail-list-item term="状态">{{userItem.is_enable}}</detail-list-item>
        <detail-list-item term="创建时间">{{userItem.create_time}}</detail-list-item>
        <detail-list-item term="最后登录时间">{{userItem.last_time}}</detail-list-item>
        <detail-list-item term="最后登录ip">{{userItem.last_ip}}</detail-list-item>
    </detail-list> 
    <a-divider style="margin-bottom: 32px"/>
    <div class="form-item-row">
        <a-form-item
            label="当前上级代理ID"
            :labelCol="{lg: {span: 7}, sm: {span: 7}}"
            :wrapperCol="{lg: {span: 17}, sm: {span: 17} }">
            <a-input
            placeholder="当前上级代理ID" v-model="agent_id"/>
            
        </a-form-item>
        <a-form-item
            label="用户密码"
            :labelCol="{lg: {span: 7}, sm: {span: 7}}"
            :wrapperCol="{lg: {span: 17}, sm: {span: 17} }">
            <a-input
            placeholder="用户密码" v-model="password"/>
            
        </a-form-item>
        
    </div>
    <div class="form-item-row">
        <a-form-item
            label="支付宝姓名"
            :labelCol="{lg: {span: 7}, sm: {span: 7}}"
            :wrapperCol="{lg: {span: 17}, sm: {span: 17} }">
            <a-input
            placeholder="支付宝姓名" v-model="zfb_user"/>
        </a-form-item>
        <a-form-item
            label="支付宝账号"
            :labelCol="{lg: {span: 7}, sm: {span: 7}}"
            :wrapperCol="{lg: {span: 17}, sm: {span: 17} }">
            <a-input
            placeholder="支付宝账号" v-model="zfb_name" />
        </a-form-item>
    </div>
    <div class="form-item-row">
        <a-form-item
            label="代理抽成比例"
            :labelCol="{lg: {span: 7}, sm: {span: 7}}"
            :wrapperCol="{lg: {span: 17}, sm: {span: 17} }">
            <a-input
            placeholder="代理抽成比例" v-model="agent_fee"/>
        </a-form-item>
        <a-form-item>
        </a-form-item>
    </div>
    <a-divider style="margin-bottom: 32px"/>
    <div style="text-align:center;">
      <a-button type="primary" style="margin-right:30px;" @click="upUser">修改</a-button>
      <a-button style="margin-left: 8px" @click="goBack()">返回</a-button>
    </div>
  </div>
</template>

<script>
import moment from 'moment'
import { taskRelease, updataUser } from '@/api/getData'
import DetailList from '@/components/tools/DetailList'
const DetailListItem = DetailList.Item
export default {
  name: 'UserDetail',
  components: {
    DetailList,
    DetailListItem
  },
  data () {
    return {
      description: '',
      value: 1,
      modalImg: false,
      userItem: {},
      defaultImg: require('../../assets/task_detail_default.png'),
      agent_id: '',
      password: '',
      zfb_user: '',
      zfb_name: '',
      agent_fee: ''

    }
  },
  created(){
    let value = sessionStorage.getItem("userItem"); 
    this.userItem = JSON.parse(value)
    this.agent_id = this.userItem.agent_id
    this.zfb_user = this.userItem.zfb_user
    this.zfb_name = this.userItem.zfb_name
    this.agent_fee = this.userItem.agent_fee
    console.log(this.userItem)
  },
  methods: {
    upUser(){
      let that = this
      this.$confirm({
          title: '确认修改用户信息?',
          content: '',
          onOk() {
              updataUser(that.userItem.id,that.password,that.zfb_user,that.zfb_name,that.agent_id,that.agent_fee).then(res=>{
                console.log(res)
                 that.$message.info(res.msg);
              })
          },
          onCancel() {}
      });
    },
    goBack(){
        this.$router.back()
    },  
    onTypeChange(){

    },  
    showBigImg(){
      this.modalImg = true
    },
  }
}
</script>

<style scoped>

.task_detail_page{
    background: rgba(255, 255, 255, 1);
    padding: 20px;
    
}
.text{
  font-size: 32px;
}
.b_text{
  font-size: 22px;
}
.task_detail_box{
  display: flex;
}
.form-item-row{
    display: flex;
    margin-bottom: 30px
}
.form-item-row>div{
    flex: 1;
}
.form-item-row .ant-input{
    width: 300px !important;
}
</style>
